/*******************************************************************************
********************************************************************************
**
* - GENERAL
*
* - PAGE CONTAINERS
*
* - HEADER
*
* - CONTENT
**
********************************************************************************
 ******************************************************************************/




/* GENERAL ------------------------------------------------------------------ */

html
{
    height: 100%;
}

/* Zero default margin & padding around common elements */
body, dd, dl, dt, form, h1, h2, h3, h4, h5, h6, ul, ol, li, p
{
    margin: 0;
    border: none;
    padding: 0;
}

body
{
    height: 100%;
    background-color: #333333;
    background-image: url(images/bg.gif);
    background-position: 0% 0;
    color: #000000;
    line-height: 1.5;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 62.5%;
    text-align: center;
    overflow:auto;
}

a:link
{
    color: #003399;
}

a:visited
{
    color: #B266B2;
}

a:hover
{
    text-decoration: none;
}




/* PAGE CONTAINERS ---------------------------------------------------------- */

#page
{
    width: 636px;
    w\idth: 600px;
    min-height: 100%;
    margin: 17px auto;
    padding: 0 18px;
    background-image: url(images/page.gif);
    background-repeat: repeat-y;
    text-align: left;
}

* html #page
{
    height: 100%;
}




/* HEADER ------------------------------------------------------------------- */

#header
{
    height: 90px;
    background-color: #B2DD32;
    background-image: url(images/header1.jpg);
    background-repeat: repeat-x;
}

h1
{
    padding: 0 35px;
    font-size: 2.2em;
    font-weight: normal;
    line-height: 82px;
}




/* CONTENT ------------------------------------------------------------------ */

#content
{
    padding: 0 25px;
}

p
{
    font-size:1.1em;
    margin-top: 1.5em;
}

form
{
    margin-top: 1.5em;
}



/*** MASTER FORM WIDTHS - CUSTOMIZE THIS TO CHANGE THE FORM LAYOUT ***/

/*
form width:		550px
left column:	190px / 180px + 10px padding
mid column:		200px
right column:	160px
*/

form{
    width:550px !important;
}

fieldset.submit
{
    padding-left: 190px !important;
}

form label{
    padding:0px 10px;
    width: 160px;
}

form label.error,
form input.submit
{
    margin-left:180px !important;
}		

form fieldset fieldset label.error
{
    margin-left:0px !important;
    width:200px !important;
}		


form .centered{
    margin-left:180px !important;
    width:200px !important;
}

form .text, 
form .button,
form .group,
form .control,
form .submit,
form textarea,
form select
{
    width: 200px !important;
}




/*** FIELDSETS AND LEGENDS ***/

form{
    width:550px;
    margin-bottom:25px;
    clear:both;
}

form fieldset
{
    margin: 0 0 1.5em 0;
    padding: 0 0 10px 0px;

    border: 1px solid #BFBAB0;

    background-color: #F2EFE9;
    background-image: url(images/fieldset_gradient.jpg);
    background-repeat: repeat-x;

    background-color: #fff;
    background-image: url(images/fieldset-gradient-02.jpg);
    background-position:bottom;

    float: left;
    clear: both;
    width: 100%;

}

form fieldset.submit
{
    padding: 0px 10px 10px 190px;
    border-style: none;

    background-color: transparent;
    background-image: none;

    float: none;
    width: auto;

}

form legend
{
    color: #000000;

    font-size:1.3em;
    font-weight: bold;
    font-variant:small-caps;

    margin-left: 1em;
    padding:0px 5px;
}

form fieldset p{
    margin:10px 0px 0px 10px;
}

/*** FORM BLOCKS ***/

form ul
{
    padding:5px 10px;
    list-style: none;
}

form li
{
    width: 100%;

    padding:5px 0px 10px 0;
    border-top:1px dotted #ccc;

    display:block;
    float: left;
    clear: left;
}

form li:first-child
{
    border:none;
}


/*** FORM BLOCK ELEMENTS ***/

form label
{
    padding:0px 10px;
    width: 160px;
    float: left;
}

form .error{
    color: #c00;
}

form label.error
{
    color: #c00;

    font-size: 100%;
    font-weight: bold;
    font-variant:small-caps;

    width:308px;
    display: none;

    margin:8px 0px 0px 180px;
    padding:3px 0px 0px 5px;
    border-top:1px dotted #ccc;

    clear:both;
}

form label.info{
    font-size: 100%;
    font-weight: bold;
    font-variant:small-caps;

    margin:8px 0px 0px 180px;
    padding:3px 0px 0px 5px;
}

form fieldset fieldset,
form .group
{
    width:200px;

    margin: 0;
    border:none;

    background:none;

    float:left;
    clear: none;

}

form fieldset fieldset label
{
    width:auto !important;
    white-space:nowrap;
    padding:0px;
    margin:0px;
    display:block;
    clear:both;
}

form label label.error{
    margin-left:0px;
}

form label.centered{
    padding:0px 0px;
    width:200px !important;
}

/* see also the error class at the foot of the page */

form fieldset fieldset label.spaced
{
    margin-bottom:3px;
}

/*** FORM ELEMENT COLUMNS ***/

.col-1,
fieldset fieldset.col-1 label
{
    width:100%;
}

.col-2,
fieldset fieldset.col-2 label
{
    width:50%;
}

.col-3,
fieldset fieldset.col-3 label
{
    width:33%;
}

.col-4,
fieldset fieldset.col-4 label
{
    width:25%;
}




/*** FORM ELEMENTS ***/

form input.submit{
    margin:10px 0px 10px 180px;
    padding:0px 2px;
}

form input, textarea, select, 
form label
{
    font-size:1.1em;
    line-height:1.6em;
}

form input, textarea, select
{
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

form .input[type="text"],
form textarea
{
    padding:1px;
}

form .input[type="radio"],
form .input[type="checkbox"]
{
    margin:0px;
    padding:0px;
    position:relative;
    top:3px;
}

/*** SUPPORTING CLASSES ***/

form label.required{
    background-image:url(images/required_star.gif);
    background-position:right;
    background-repeat:no-repeat;
}

form span.required{
    padding-right:15px;
}

form .clean
{
    border:none;
}

form .info{
    padding-top:0.5em;
    font-size:80%;
    line-height:100%;
    color:#aaa;
}

form .indent{
    padding:2px 20px; 
    width:auto !important;
    white-space:nowrap;
    padding-left: 25px !important;
}

form label.disabled{
    color:#aaa;
}

form .highlight{
    background-color:#e2e2e2;
}

.off{
    display:none !important;
}

.clear{
    clear:both;
}
